<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>Around the World in Eight Hours</title>
		<link rel="stylesheet" href="css/index.css" />
	</head>
	<body>
		<div id="container">
			<div id="tool-header">
				
			</div>
			<div id="menu-header">
				<div class="menu-item" style="margin-left: 20px;">
					<img src="img/tour.svg" />
					<span>Tour</span>
					<div class="drop-menu">
						<div class="first-menu-option">
							<span>Asia</span>
							<div class="drop-second-menu">
								<div class="second-menu-option">
									<span>China</span>
									<div class="drop-third-menu">
										<div class="third-menu-option" onclick="toYangzhouPage()">
											<span>Yangzhou</span>
										</div>
										<div class="third-menu-option">
											<span>Nanjing</span>
										</div>
										<div class="third-menu-option">
											<span>Shanghai</span>
										</div>
										<div class="third-menu-option">
											<span>Beijing</span>
										</div>
									</div>
								</div>
							</div>
						</div>
						<div class="first-menu-option">
							<span>Africa</span>
						</div>
						<div class="first-menu-option">
							<span>Europe</span>
						</div>
						<div class="first-menu-option">
							<span>America</span>
							<div class="drop-second-menu">
								<div class="second-menu-option">
									<span>the USA</span>
									<div class="drop-third-menu">
										<div class="third-menu-option">
											<span>Miami</span>
										</div>
										<div class="third-menu-option" onclick="toNewYorkPage()">
											<span>New York</span>
										</div>
										<div class="third-menu-option">
											<span>San Francisco</span>
										</div>
										<div class="third-menu-option">
											<span>seattlo</span>
										</div>
									</div>
								</div>
							</div>
						</div>
						<div class="first-menu-option">
							<span>Others</span>
						</div>
					</div>
				</div>
				<div class="menu-item">
					<img src="img/camera.svg" />
					<span>Camera</span>
				</div>
				<div class="menu-item">
					<img src="img/print2.svg" />
					<span>Print</span>
				</div>
			</div>
			<div id="content">
				<div style="padding-top: 40px; padding-right: 10px; text-align: right;">
					<img style="width: 45%;" src="img/plan.png" />
				</div>
				<div style="padding: 0 50px; margin-top: 20px;">
					<span style="font-size: 18px; line-height: 35px;">
						Welcome to “Around the World in Eight Hours”.I'm your tour guide, Robin.Have you noticed the “Tour” icon at the top of the page? Just click on it, and you can visit Asia, Africa, Europe, America and more in only eight hours!
					</span>
				</div>
				<div style="padding: 10px 50px 0 50px; text-align: center;">
					<img src="img/1.png" style="width: 90%;" />
				</div>
			</div>
		</div>
		<script src="js/jquery.min.js"></script>
		<script>
			function toNewYorkPage() {
				location.href = "./newYork.html";
			}
			
			function toYangzhouPage() {
				location.href = "./yangzhou.html";
			}
		</script>
	</body>
</html>
